import React, { useEffect } from 'react';
import { lateralView, clearCanvas } from '@/utils/canvas';

function Chart3({ list = [], name, guide }) {
  useEffect(() => {
    const arr4 = [
      ['行走能力', 26, 5],
      ['上下楼梯', 31, 4],
      ['跳', 35, 3],
      ['骑脚踏车', 45, 2],
      ['球类活动', 47, 6],
    ];
    clearCanvas('view4');
    lateralView(guide.code, 'view4', list, `领域二：${name}侧面图`, name, null, false, arr4);
  }, [list]);

  return (
    <>
      <canvas
        width="1200"
        height="600"
        style={{ margin: '30px 0', width: '100%', border: '1px solid #ddd' }}
        id="view4"
      />
    </>
  );
}
export default Chart3;
